Android ios 鸿蒙 动态设置应用桌面角标badge消息未读数 桌面角标数量设置
插件 ID: 24218
来源: https://ext.dcloud.net.cn/plugin?id=24218
动态设置应用角标badge消息未读数 桌面角标数量设置
更新记录
1.0.3（2025-11-06）
优化
1.0.2（2025-09-11）
优化
1.0.1（2025-07-06）
增加ios 和 鸿蒙 查看更多
平台兼容性
uni-app(3.6.13)
| Vue2 | Vue3 | Chrome | Safari | app-vue | app-nvue | Android | iOS | 鸿蒙 | | | √ | √ |
- |
- | √ | √ | 5.0 | √ | √ | | | 微信小程序 | 支付宝小程序 | 抖音小程序 | 百度小程序 | 快手小程序 | 京东小程序 | 鸿蒙元服务 | QQ小程序 | 飞书小程序 | 小红书小程序 | 快应用-华为 | 快应用-联盟 | | |
- |
- |
- |
- |
- |
- |
- |
- |
- |
- |
- |
- | |
uni-app x(3.6.13)
| Chrome | Safari | Android | iOS | 鸿蒙 | 微信小程序 | | |
- |
- | 5.0 | √ | √ |
- | |
其他
| 多语言 | 暗黑模式 | 宽屏模式 | | | √ | √ | √ | |
xtf-brage
android ios 桌面角标设置
插件支持Android ios 设置桌面角标数量 Android 支持 华为 荣耀 小米 vivo oppo（需要向官网申请角标权限） 魅族 三星 等多种手机 因为系统限制 小米手机实现方法不同 所以单独实现 若不显示角标 请确认应用是否有通知权限 无通知权限可能不显示角标
插件测试使用方法
选择试用，绑定要试用的项目appid， 选择后下载到对应的本地项目， 按照文档 -》把插件引入项目（即
import { NotifationPara, cancelNotifation, checkAppNotification, onOpenNotificationSetting, sendNotifation, showBrage,isXiaomiDevice } from '@/uni_modules/xtf-brage';需要先引入）， 发布-》云打包-》选择制作基座-》打包等基座制作完成 运行 -》 运行到手机或模拟器-》运行到Androidapp基座-》选择使用自定义基座运行-》选择手机-》运行 若之前手机安装过基座需要先卸载之前的基座
uniapp
<template>
<view>
<button type="primary" style="margin: 10rpx;" @click="onClick(0)">设置桌面角标数量66</button>
<button type="primary" style="margin: 10rpx;" @click="onClick(1)">设置桌面角标数量0</button>
<button type="primary" style="margin: 10rpx;" @click="onClick(2)">检测是否有通知权限</button>
<button type="primary" style="margin: 10rpx;" @click="onClick(3)">打开通知权限设置</button>
<button type="primary" style="margin: 10rpx;" @click="onClick(4)">发送通知</button>
<button type="primary" style="margin: 10rpx;" @click="onClick(5)">取消通知</button>
</view>
</template>
<script>
import { NotifationPara, cancelNotifation, checkAppNotification, onOpenNotificationSetting, sendNotifation, showBrage,isXiaomiDevice } from '@/uni_modules/xtf-brage';
export default {
data() {
return {
title: 'Hello'
}
},
onLoad() {
},
methods: {
onClick(id){
if(id==0){
showBrage(66)
if(isXiaomiDevice()){
sendNotifation({
title:"Test",
content:"msg",
showBrage:true,
count:66,
})
}
}else if(id==1){
showBrage(0)
if(isXiaomiDevice()){
cancelNotifation();
}
}
else if(id==2){
checkAppNotification(function(r){
uni.showToast({
title:""+r,
icon:"none"
});
})
}else if(id==3){
onOpenNotificationSetting(function(res:boolean){
uni.showToast({
title:""+res,
icon:"none"
});
})
}else if(id==4){
sendNotifation({
title:"Test",
content:"msg",
})
}else if (id==5){
cancelNotifation(6234542);
}
}
}
}
</script>
<style>
</style>uniappx
<template>
<view>
<button type="primary" style="margin: 10rpx;" @click="onClick(0)">设置桌面角标数量66</button>
<button type="primary" style="margin: 10rpx;" @click="onClick(1)">设置桌面角标数量0</button>
<button type="primary" style="margin: 10rpx;" @click="onClick(2)">检测是否有通知权限</button>
<button type="primary" style="margin: 10rpx;" @click="onClick(3)">打开通知权限设置</button>
<button type="primary" style="margin: 10rpx;" @click="onClick(4)">发送通知</button>
<button type="primary" style="margin: 10rpx;" @click="onClick(5)">取消通知</button>
</view>
</template>
<script>
import { NotifationPara, cancelNotifation, checkAppNotification, onOpenNotificationSetting, sendNotifation, showBrage,isXiaomiDevice } from '@/uni_modules/xtf-brage';
export default {
data() {
return {
title: 'Hello'
}
},
onLoad() {
},
methods: {
onClick(id:number){
if(id==0){
showBrage(66)
if(isXiaomiDevice()){
sendNotifation({
title:"Test",
content:"msg",
showBrage:true,
count:66,
} as NotifationPara)
}
}else if(id==1){
showBrage(0)
if(isXiaomiDevice()){
cancelNotifation();
}
}
else if(id==2){
checkAppNotification(function(r:boolean){
uni.showToast({
title:""+r,
icon:"none"
});
})
}else if(id==3){
onOpenNotificationSetting(function(res:boolean){
uni.showToast({
title:""+res,
icon:"none"
});
})
}else if(id==4){
sendNotifation({
title:"Test",
content:"msg",
} as NotifationPara)
}else if (id==5){
cancelNotifation(6234542);
}
}
}
}
</script>
<style>
</style>通知参数
export type NotifationPara={
id?:number,// 通知id
title?:string,//通知标题
content?:string,// 通知内容
channelId?:string,// 通知channelid
channelName?:string,// 通知channelName
channelSound?:boolean,//通知是否有声音 和channelid 绑定 无效换channelid或者卸载应用
showBrage?:boolean,// 桌面角标
count?:number // 角标数量
}